<template>
  <div class="form-panel">
    <div class="form-panel-body">
      <div class="form-panel-body-inner">
        <slot></slot>
      </div>
    </div>
    <div class="form-panel-footer">
      <div class="form-panel-footer-bg"></div>
      <div class="form-panel-footer-inner">
        <slot name="footer">
          <el-button type="primary" class="footer-button" size="small" @click="handleClick">{{ okText }}</el-button>
        </slot>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'FormPanel',
  props: {
    okClick: {
      type: Function,
      default: () => {}
    },
    okText: {
      type: String,
      default: '保 存'
    }
  },
  methods: {
    handleClick() {
      this.okClick()
    }
  }
}
</script>

<style scoped></style>
